<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>JSDoc: Class: Draggable</title>

    <script src="scripts/prettify/prettify.js"> </script>
    <script src="scripts/prettify/lang-css.js"> </script>
    <!--[if lt IE 9]>
      <script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->
    <link type="text/css" rel="stylesheet" href="styles/prettify-tomorrow.css">
    <link type="text/css" rel="stylesheet" href="styles/jsdoc-default.css">
</head>

<body>

<div id="main">

    <h1 class="page-title">Class: Draggable</h1>

    




<section>

<header>
    
        <h2><span class="attribs"><span class="type-signature"></span></span>
            <span class="ancestors"><a href="module-utils_directives_draggable.html">utils/directives/draggable</a>~</span>Draggable<span class="signature">(document, el, options<span class="signature-attributes">opt</span>)</span><span class="type-signature"></span></h2>
        
            <div class="class-description"><p>拖拽实现类 继承 <a href="module-utils_events-Events.html">Events</a></p></div>
        
    
</header>

<article>
    <div class="container-overview">
    
        

    
    <h2>Constructor</h2>
    

    
    <h4 class="name" id="Draggable"><span class="type-signature"></span>new Draggable<span class="signature">(document, el, options<span class="signature-attributes">opt</span>)</span><span class="type-signature"></span></h4>
    

    



<div class="description">
    <p>构造函数</p>
</div>









    <h5>Parameters:</h5>
    

<table class="params">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>

        
        <th>Attributes</th>
        

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>document</code></td>
            

            <td class="type">
            
                
<span class="param-type">HtmlDocument</span>


            
            </td>

            
                <td class="attributes">
                

                

                
                </td>
            

            

            <td class="description last"><p>HTML 文档对象</p></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>el</code></td>
            

            <td class="type">
            
                
<span class="param-type">HtmlElement</span>


            
            </td>

            
                <td class="attributes">
                

                

                
                </td>
            

            

            <td class="description last"><p>需要拖拽的元素</p></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>options</code></td>
            

            <td class="type">
            
                
<span class="param-type">object</span>


            
            </td>

            
                <td class="attributes">
                
                    &lt;optional><br>
                

                

                
                </td>
            

            

            <td class="description last"><p>参数选项，默认值：<a href="module-utils_directives_draggable.html#~defaultOptions">defaultOptions</a></p></td>
        </tr>

    
    </tbody>
</table>






<dl class="details">

    

    

    

    

    

    

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="directives_draggable.js.html">directives/draggable.js</a>, <a href="directives_draggable.js.html#line106">line 106</a>
    </li></ul></dd>
    

    

    

    
</dl>


















    
    </div>

    
        <h3 class="subsection-title">Extends</h3>

        


    <ul>
        <li>Events</li>
    </ul>


    

    

    

    

    

    

    
        <h3 class="subsection-title">Members</h3>

        
            
<h4 class="name" id="document"><span class="type-signature"></span>document<span class="type-signature"> :HtmlDocument</span></h4>




<div class="description">
    <p>HTML文档对象</p>
</div>



    <h5>Type:</h5>
    <ul>
        <li>
            
<span class="param-type">HtmlDocument</span>


        </li>
    </ul>





<dl class="details">

    

    

    

    

    

    

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="directives_draggable.js.html">directives/draggable.js</a>, <a href="directives_draggable.js.html#line119">line 119</a>
    </li></ul></dd>
    

    

    

    
</dl>






        
            
<h4 class="name" id="droppables"><span class="type-signature"></span>droppables<span class="type-signature"> :Array.&lt;HtmlElement></span></h4>




<div class="description">
    <p>可放置的元素数组, 开始拖拽后才会创建</p>
</div>



    <h5>Type:</h5>
    <ul>
        <li>
            
<span class="param-type">Array.&lt;HtmlElement></span>


        </li>
    </ul>





<dl class="details">

    

    

    

    

    

    

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="directives_draggable.js.html">directives/draggable.js</a>, <a href="directives_draggable.js.html#line329">line 329</a>
    </li></ul></dd>
    

    

    

    
</dl>






        
            
<h4 class="name" id="el"><span class="type-signature"></span>el<span class="type-signature"> :HtmlElement</span></h4>




<div class="description">
    <p>需要拖拽的元素</p>
</div>



    <h5>Type:</h5>
    <ul>
        <li>
            
<span class="param-type">HtmlElement</span>


        </li>
    </ul>





<dl class="details">

    

    

    

    

    

    

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="directives_draggable.js.html">directives/draggable.js</a>, <a href="directives_draggable.js.html#line124">line 124</a>
    </li></ul></dd>
    

    

    

    
</dl>






        
            
<h4 class="name" id="options"><span class="type-signature"></span>options<span class="type-signature"> :Object</span></h4>




<div class="description">
    <p>实例化选项参数对象</p>
</div>



    <h5>Type:</h5>
    <ul>
        <li>
            
<span class="param-type">Object</span>


        </li>
    </ul>





<dl class="details">

    

    

    

    

    

    

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="directives_draggable.js.html">directives/draggable.js</a>, <a href="directives_draggable.js.html#line138">line 138</a>
    </li></ul></dd>
    

    

    

    
</dl>






        
    

    
        <h3 class="subsection-title">Methods</h3>

        
            

    

    
    <h4 class="name" id="destroy"><span class="type-signature"></span>destroy<span class="signature">()</span><span class="type-signature"></span></h4>
    

    



<div class="description">
    <p>销毁，释放内存</p>
</div>













<dl class="details">

    

    

    

    

    

    

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="directives_draggable.js.html">directives/draggable.js</a>, <a href="directives_draggable.js.html#line497">line 497</a>
    </li></ul></dd>
    

    

    

    
</dl>


















        
            

    

    
    <h4 class="name" id="reset"><span class="type-signature"></span>reset<span class="signature">(options<span class="signature-attributes">opt</span>)</span><span class="type-signature"></span></h4>
    

    



<div class="description">
    <p>当选项参数改变时调用，更新组件</p>
</div>









    <h5>Parameters:</h5>
    

<table class="params">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>

        
        <th>Attributes</th>
        

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>options</code></td>
            

            <td class="type">
            
                
<span class="param-type">object</span>


            
            </td>

            
                <td class="attributes">
                
                    &lt;optional><br>
                

                

                
                </td>
            

            

            <td class="description last"><p>参数选项, 参考：<a href="module-utils_directives_draggable.html#~defaultOptions">defaultOptions</a></p></td>
        </tr>

    
    </tbody>
</table>






<dl class="details">

    

    

    

    

    

    

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="directives_draggable.js.html">directives/draggable.js</a>, <a href="directives_draggable.js.html#line176">line 176</a>
    </li></ul></dd>
    

    

    

    
</dl>


















        
    

    

    
</article>

</section>




</div>

<nav>
    <h2><a href="index.html">Home</a></h2><h3>Modules</h3><ul><li><a href="module-utils_ajax.html">utils/ajax</a></li><li><a href="module-utils_axios.html">utils/axios</a></li><li><a href="module-utils_bus.html">utils/bus</a></li><li><a href="module-utils_console.html">utils/console</a></li><li><a href="module-utils_convert.html">utils/convert</a></li><li><a href="module-utils_cookie.html">utils/cookie</a></li><li><a href="module-utils_crypto.html">utils/crypto</a></li><li><a href="module-utils_date.html">utils/date</a></li><li><a href="module-utils_directives_clipboard.html">utils/directives/clipboard</a></li><li><a href="module-utils_directives_draggable.html">utils/directives/draggable</a></li><li><a href="module-utils_directives_droppable.html">utils/directives/droppable</a></li><li><a href="module-utils_directives_resizable.html">utils/directives/resizable</a></li><li><a href="module-utils_directives_selecttext.html">utils/directives/selecttext</a></li><li><a href="module-utils_dom.html">utils/dom</a></li><li><a href="module-utils_download.html">utils/download</a></li><li><a href="module-utils_events.html">utils/events</a></li><li><a href="module-utils_lunar.html">utils/lunar</a></li><li><a href="module-utils_mock.html">utils/mock</a></li><li><a href="module-utils_openlayer.html">utils/openlayer</a></li><li><a href="module-utils_queue.html">utils/queue</a></li><li><a href="module-utils_skin.html">utils/skin</a></li><li><a href="module-utils_storage.html">utils/storage</a></li><li><a href="module-utils_theme.html">utils/theme</a></li><li><a href="module-utils_tween.html">utils/tween</a></li><li><a href="module-utils_url.html">utils/url</a></li><li><a href="module-utils_util.html">utils/util</a></li></ul><h3>Classes</h3><ul><li><a href="module-utils_directives_draggable-Draggable.html">Draggable</a></li><li><a href="module-utils_directives_droppable-Droppable.html">Droppable</a></li><li><a href="module-utils_directives_resizable-Resizable.html">Resizable</a></li><li><a href="module-utils_events-Events.html">Events</a></li><li><a href="module-utils_openlayer-Openlayers.html">Openlayers</a></li><li><a href="module-utils_queue-Queue.html">Queue</a></li></ul><h3>Events</h3><ul><li><a href="module-utils_queue-Queue.html#event:complete">complete</a></li><li><a href="module-utils_queue-Queue.html#event:error">error</a></li><li><a href="module-utils_queue-Queue.html#event:success">success</a></li></ul>
</nav>

<br class="clear">

<footer>
    Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.5.5</a> on Sun Oct 28 2018 10:45:22 GMT+0800 (CST)
</footer>

<script> prettyPrint(); </script>
<script src="scripts/linenumber.js"> </script>
</body>
</html>